<?php
    global $tb_basepath;
    global $tb_baseurl;


    include "$tb_basepath/lib/tb_ajax.php";
?>

<!--
<script src="http://staging.tokbox.com/v0.90/js/TB.min.js" type="text/javascript" charset="utf-8"></script>
//-->
<script type="text/javascript" src="http://static.opentok.com/v0.91/js/TB.min.js"></script>


<script type="text/javascript" charset="utf-8">
     var mySession;
     // Example session id
		var partnerKey = "<?=$tokboxpartnerid?>";
		var sessionId = "<?=$tokboxsessionid?>";
    var token = "<?=$tokboxtoken?>";

     function exceptionHandler (event ) {
				alert("Exception! msg: " + event.message + " title: " + event.title + " code: " + event.code);
     }
function sessionConnectedHandler (event) {
     for (var i=0; i < event.streams.length; i++) {
        addStream(event.streams[i]);
     }
     RetriveFocus();
}
function streamCreatedHandler (event ) {
     for (var i=0; i < event.streams.length; i++) {
        addStream(event.streams[i]);
     }
}
function streamDestroyedHandler (event ) {
		for (var i=0; i < event.streams.length; i++) {
			var subscribers = mySession.getSubscribersForStream(event.streams[i]);
			for (var j=0; j < subscribers.length; j++) {
						var sid = subscribers[j].id;
						mySession.unsubscribe(subscribers[j]);
						releaseDIV(sid);
			}
		}
}
function sessionDisconnectedHandler(event){


    //  Clean up subscribers
    for(var subscriberid in mySession.subscribers ){  // javascript's for in loop list the key, not value for array[key]=value.
       mySession.unsubscribe( mySession.subscribers[subscriberid ] );
    }
}

			function connectionDestroyedHandler(event){
                // Potential local cleanup
            }

			function connectionCreatedHandler(session,connectionEvents){
			    // This signals new connections have
			    // been created.
			}



function addStream (stream) {
		 if (stream.connection.connectionId == mySession.connection.connectionId)
          return;

		 var did = firstEmptyDivID();
		 if ( did>0 )
		 {
     		var div = document.getElementById('video' + did );
     		var divChild = document.createElement('div');
     		var divId = stream.streamId;
     		divChild.setAttribute('id', divId);
		div.innerHTML="";
     		div.appendChild(divChild);

 				obj = new Object();
				obj.width=<?=$videowidth?>;
				obj.height=<?=$videoheight?>;

				var subscriber = mySession.subscribe(stream, divId,obj);

				divarray[did]=subscriber.id;
				cidArray[did]=stream.connection.connectionId;

				
		 }
}
function show (id) {
     document.getElementById(id).style.display = "block";
}
function hide (id) {
		document.getElementById(id).style.display = "none";
}
function sleep(milliSeconds){
    var startTime = new Date().getTime(); // get the current time
    while (new Date().getTime() < startTime + milliSeconds); // hog cpu
}
function connect(){
    mySession.connect(100091,token);
}

function disconnect(){
	  mySession.disconnect();

}
function unsubscribe()
{
/*
    for(var subscriberid in mySubscribers  ){
       mySession.unsubscribe( mySubscribers[subscriberid ] );
    }
*/
    for(var subscriberid in mySession.subscribers ){
       mySession.unsubscribe( mySession.subscribers[subscriberid ] );
    }

}

</script>
<br>

<!-- <a href="javascript:unsubscribe()">disconnect</a>  -->
<br>
     <script type="text/javascript" charset="utf-8">
				TB.setLogLevel(TB.ERROR);
        if (TB.checkSystemRequirements() != TB.HAS_REQUIREMENTS) {
                alert("Minimum System Requirements not met!");
        }

        mySession = TB.initSession(sessionId);
        TB.addEventListener(TB.EXCEPTION, exceptionHandler);
			  mySession.addEventListener(TB.SESSION_CONNECTED, sessionConnectedHandler);
        mySession.addEventListener(TB.SESSION_DISCONNECTED, sessionDisconnectedHandler);
			  mySession.addEventListener(TB.CONNECTION_CREATED, connectionCreatedHandler);
			  mySession.addEventListener(TB.CONNECTION_DESTROYED, connectionDestroyedHandler);
			  mySession.addEventListener(TB.STREAM_CREATED, streamCreatedHandler);
			  mySession.addEventListener(TB.STREAM_DESTROYED, streamDestroyedHandler);
			  mySession.addEventListener("signalReceived", signalHandler );


				connect();


     </script>


<?
include "template.php";
?>
<script>
var divcount=1;

for ( i=1; i<=21; i++)
{
    div = document.getElementById( "video" + i );
		if ( div == null )
			break;
}

divcount=i-1; // maxium 20 videos
//alert (divcount);


var divarray = new Array();
var cidArray = new Array();  // keep all stream's connectionid .
for ( i=1; i<=divcount; i++)
{
	divarray[i]="";
	cidArray[i]="";
}

function releaseDIV( sid ) {
	for ( i=1; i<=divcount; i++)
	{
		if (  divarray[i] == sid ) 
		{
			divarray[i]="";
			cidArray[i]="";
			j=i+1;
    			div = document.getElementById( "video" + i );
			if ( div == null )
				break;
			div.innerHTML="<img border=0 width=<?=$cell_width?> height=<?=$cell_height?> src=\"<?global $tb_baseurl;echo $tb_baseurl?>/config/people.jpg\">";
			break;
		}
	}
	if ( big_subscriber == sid )
	{
    		div = document.getElementById( "video_big"  );
		if ( div != null )
			div.innerHTML="<img border=0 width=<?=$bv_width?> height=<?=$bv_height?> src=\"<?global $tb_baseurl;echo $tb_baseurl?>/config/people.jpg\">";
		big_subscriber=null;
	}
}

function firstEmptyDivID () {
	for ( i=1; i<=divcount; i++)
	{
		if (  divarray[i] == "" ) 
		{
			return i;
		}
	}
	return 0;
}
</script>
